<!DOCTYPE html>
<!--suppress ALL -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div>
  <!-- th:text - 展示普通文本, spel 表达式 -->
  <h1>
    欢迎回来：
    <span th:text="${user.friend.name}"></span>
  </h1>
  <hr>
  <!-- 内置对象 -->
  <span th:text="${#dates.format(#dates.createNow(), 'yyyy-MM-dd HH:mm:ss:SSS')}"></span>
  <hr>
  <!-- th:utext - 解析前端标签 -->
  <span th:utext="'<font color=\'red\'>hello</font>'"></span><br>
  <span th:utext="'<font color=\'blue\'>hello</font>'"></span>
  <hr>
  <!-- 字面值 -->
  <span th:text="100 + 200"></span>
  <hr>
  <!-- th:each - for 循环 -->
  <ul>
    <li th:each="u : ${users}">
      <span th:text="${u.name}"></span>
      <span th:text="${u.age}"></span>
    </li>
  </ul>
</div>

<script th:inline="javascript">
  // js 模板 - 内联模板
  const users = /*[[${users}]]*/[];

  for (let i in users) {
    console.log(users[i]);
  }
</script>
</body>
</html>